import React,{PureComponent} from 'react'
import {View,Button,SafeAreaView,Text,StyleSheet,TextInput,ScrollView,Dimensions,TouchableOpacity} from 'react-native'
import color from "../../../widget/color";
import RefreshListView, {RefreshState} from "react-native-refresh-list-view";
import MinePayCell from '../../../widget/mine/MinePayCell'
import MinePayDetailScene from './MinePayDetailScene'
import api from "../../../api/api";
import method from "../../../api/method";
import {fetchGetRequest, fetchPostRequest} from "../../../api/NetworkTool";
import RefreshList from "../../../widget/multystateview/RefreshList";
import NetTool from "../../../api/NetTool";
import {NavigationActions} from "react-navigation";
import EmptyCouponView from "../../../widget/CommonEmptyView";
import CommonAlertDialog from '../../../widget/dialog/CommonAlertDialog'

const {width, height} = Dimensions.get('window')


type Props = {
    navigation:any,
}
type State = {
    data: Array<Object>,
    refreshState: number,
}

export default class MinePayOrderScene extends PureComponent<Props,State>{
    static navigationOptions = ({navigation}: any) => ({
        headerTintColor:'white',
        headerStyle:{
            backgroundColor:color.globalMainColor
        },
        title:'我的订单',
    });
    constructor(props) {
        super(props)
        this.state = {
            data: [],
            refreshState: RefreshState.Idle,
            show_alert:false,
            orderid:'',
        }
    }
    componentDidMount() {
        this.requestFirstPage()
    }
    requestData = async() =>{

        let params = {
            status:'paid',
        }
        let json = await NetTool.fetchGetRequest(api.getOrderList,method.get, params)


        let dataList = json.orders.map((info) => {
            return {
                course:info.course,
                payStatus: info.payStatus,
                payment: info.payment,
                price:info.price,
                orderSn:info.orderSn,
                id:info.id,
                refundStatus:info.refundStatus,
            }
        })

        return dataList
    }


    requestFirstPage = async() => {

        try {
            this.setState({refreshState: RefreshState.HeaderRefreshing})
            let dataList = await this.requestData()
            
            let data = []
            dataList.forEach(info=>{
                if (info.refundStatus == 'unrefund'){
                    data.push(info)
                }
            })

            this.setState({
                data: data,
                refreshState: RefreshState.Idle,
            })
        } catch (error) {
            this.setState({
                refreshState: RefreshState.Failure,
            })
        }
    }
    requestNextPage = async() => {
    }


    //custon ui
    keyExtractor = (item: Object, index: number) => {
        return index + ''
    }
    renderCell = ({item}: any) => {
        return (
            <MinePayCell
                // coursePress={()=>{
                //     // //重置根视图，闪屏页=>主界面后销毁掉
                //     // const resetAction = NavigationActions.reset({
                //     //     index: 0,
                //     //     actions: [NavigationActions.navigate({ routeName: 'home'})]})
                //     // this.props.navigation.dispatch(resetAction)
                // }}
                deletePress={()=>{
                    this.deleteOrder(item.id)
                }}
                onPress={()=>{this.onCellPaySelected(item)}} info={item}
            />
        )
    }
    deleteOrder(orderId){
        this.setState({show_alert:true,orderid:orderId})


    }
    confirmOpress() {
        let params = {
            orderId:this.state.orderid,
        }
        fetchPostRequest(api.removeOrder,method.post,params)
            .then(res=>{
                this.requestFirstPage()
            })
            .catch(err=>{})
    }
    onCellPaySelected(info) {
        this.props.navigation.navigate('MinePayDetailScene',{orderId:info.id})
    }
    render(){
        return (
            <View style={{flex:1}}>
                <RefreshListView
                    ListHeaderComponent={() => (
                        !this.state.data.length?
                            <EmptyCouponView height={(height-200)} tip={'您还没有订单'} source={require('../../../../res/img/order/dingdan.png')}/>
                            : null)
                    }
                    data={this.state.data}
                    renderItem={this.renderCell}
                    keyExtractor={this.keyExtractor}
                    refreshState={this.state.refreshState}
                    onHeaderRefresh={this.requestFirstPage}
                    onFooterRefresh={this.requestNextPage}
                />
                <CommonAlertDialog title={'确定删除订单？'} onPress={()=>{this.confirmOpress()}} closeModal={(statu)=>{this.setState({show_alert:statu})}}
                                   confirmTitle={'确定'} show={this.state.show_alert}/>
            </View>
        )
    }
}